import React from 'react'
import {
 Button, Row, Col, Divider,
} from 'antd'
import styles from './index.less'

class HufuCard extends React.Component {
  constructor(props) {
    super(props)
    this.state = {}
  }

  render() {
    const {
      title, titleClick, desc, icon, titleText,
    } = this.props
    return (
      <div className={styles.hufu_card}>
        <div className={styles.hufu_card_right}>
          <div
            className={`${styles.hufu_card_title} ${styles.text_overflow_single}`}
            title={titleText || title}
            onClick={titleClick}
          >
            {title}
          </div>
          {desc ? (
            <div className={`${styles.hufu_card_desc} ${styles.text_overflow_single}`} title={desc}>
              {desc}
            </div>
          ) : null}
          <div className={styles.hufu_card_center}>
            <div className={styles.hufu_card_center_half}>
              <div className={styles.hufu_card_item}>
                <span className={styles.hufu_card_label}>已注册数据源</span>
                <span className={styles.hufu_card_num}>{this.props.registerDsNum}</span>
              </div>
              <div className={styles.hufu_card_item}>
                <span className={styles.hufu_card_label}>已创建指标</span>
                <span className={styles.hufu_card_num}>{this.props.indexNum}</span>
              </div>
              <div className={styles.hufu_card_item}>
                <span className={styles.hufu_card_label}>数据集成任务</span>
                <span className={styles.hufu_card_num}>{this.props.integrateTaskNum}</span>
              </div>
              <div className={styles.hufu_card_item}>
                <span className={styles.hufu_card_label}>成员数量</span>
                <span className={styles.hufu_card_num}>{this.props.userNum}</span>
              </div>
            </div>
            <Divider type="vertical" style={{ height: '1.2rem', margin: '0 18px' }} />
            <div className={styles.hufu_card_center_half}>
              <div className={styles.hufu_card_item}>
                <span className={styles.hufu_card_label}>已创建数据表</span>
                <span className={styles.hufu_card_num}>{this.props.tableNum}</span>
              </div>
              <div className={styles.hufu_card_item}>
                <span className={styles.hufu_card_label}>已创建API</span>
                <span className={styles.hufu_card_num}>{this.props.apiNum}</span>
              </div>
              <div className={styles.hufu_card_item}>
                <span className={styles.hufu_card_label}>数据开发任务</span>
                <span className={styles.hufu_card_num}>{this.props.developTaskNum}</span>
              </div>
              <div className={styles.hufu_card_item}>
                <span className={styles.hufu_card_label}>创建时间</span>
                <span className={styles.hufu_card_num}>{this.props.createTime}</span>
              </div>
            </div>
          </div>
        </div>
        <div className={styles.hufu_card_footer}>
          <Button size="large" onClick={this.props.deleteClick} type="link" danger className={styles.hufu_card_btn}>删除空间</Button>
          <Divider type="vertical" style={{ height: '0.3rem' }} />
          <Button size="large" onClick={this.props.enterClick} type="link" className={styles.hufu_card_btn}>进入空间</Button>
        </div>
      </div>
    )
  }
}
export default HufuCard
